<style>
	.panel {
		width: 200px;
		height: 130px;
		left: 10%;
		top: 50px;
		background-color: #AAAAAA;
		position: absolute;
	}
	.facilityPanel {
		top: 152px;
		left: 80%;
		width: 200px;
		position: absolute;
	}
	.rTypePosition {
		top: 82px;
		color: #000000;
		/*background-color: #999999;*/
		position: absolute;
	}

</style>
<script>
	$(function() {
		$('.panel').mouseenter(function(){
		$('canvas').unbind('click');
		}).mouseleave(function() {
			$('canvas').bind('click', function(event) {getFacility(event)
			});
		});
		$('.Move_f').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -44px");
		}).mousedown(function() {
			//alert('mousedown');
			controls.freeze = false;
			controls.moveForward = true;

			controls.moveRightFreeze = false;
			controls.moveLeftFreeze = false;
			controls.moveBackwardFreeze = false;

		});
		$('.Move_r').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -88px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.moveRight = true;

			controls.moveForwardFreeze = false;
			controls.moveLeftFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Move_b').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -132px");

		}).mousedown(function() {
			controls.freeze = false;
			controls.moveBackward = true;

			controls.moveRightFreeze = false;
			controls.moveLeftFreeze = false;
			controls.moveForwardFreeze = false;

		});
		$('.Move_o').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -132px");

		}).mousedown(function() {
			camera.position.copy(camera.orgPosition);
			controls.moveRightFreeze = false;
			controls.moveLeftFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;

		});
		$('.Move_l').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -176px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.moveLeft = true;

			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Rotate_l').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -176px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.rotateLeft = true;
		});
		$('.Rotate_r').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -176px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.rotateRight = true;
		});
		$('.Rotate_l').mouseup(function() {
			controls.freeze = true;

			controls.moveForward = false;
			controls.moveRight = false;
			controls.moveBackward = false;
			controls.moveLeft = false;

			controls.rotateLeft = false;
			controls.rotateRight = false;

			controls.lookUp = false;
			controls.lookRight = false;
			controls.lookDown = false;
			controls.lookLeft = false;
			controls.constrainVertical = true;
		});
		$('.Look_u').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -44px");
		}).mousedown(function() {
			//alert('mousedown');
			controls.freeze = false;
			controls.lookUp = true;

			controls.moveLeftFreeze = false;
			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Look_r').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -88px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.lookRight = true;

			controls.moveLeftFreeze = false;
			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Look_d').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -132px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.lookDown = true;

			controls.moveLeftFreeze = false;
			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Look_l').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -176px");
		}).mousedown(function() {
			controls.freeze = false;
			controls.lookLeft = true;

			controls.moveLeftFreeze = false;
			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;
		});
		$('.Look_o').mouseenter( function() {
		$('.BMap_stdMpPan').css('background-position',"0px -132px");

		}).mousedown(function() {
			controls.lookOrgin = true;
			controls.freeze = false;

			controls.moveLeftFreeze = false;
			controls.moveRightFreeze = false;
			controls.moveForwardFreeze = false;
			controls.moveBackwardFreeze = false;

		});
		$('.BMap_button').mouseleave( function() {
		$('.BMap_stdMpPan').css('background-position',"0px 0px");
		setCtrlsFlagToFalse();
		}).mouseup(function() {
			setCtrlsFlagToFalse();

		});
		function setCtrlsFlagToFalse() {
			controls.freeze = true;

			controls.moveForward = false;
			controls.moveRight = false;
			controls.moveBackward = false;
			controls.moveLeft = false;

			controls.rotateLeft = false;
			controls.rotateRight = false;

			controls.lookUp = false;
			controls.lookRight = false;

			controls.lookDown = false;
			controls.lookLeft = false;
			controls.lookOrgin = false;
			//controls.lon=-110;
			lon = controls.lon;
		}

		$('.stdMoveCtr').mouseenter(function(){
		$('.moveCtrRm').css('color',"#990000");
		}).mouseleave(function() {
			$('.moveCtrRm').css('color', "#000000");
		});
		$('.stdLookCtr').mouseenter(function(){
		$('.lookCtrRm').css('color',"#990000");
		}).mouseleave(function() {
			$('.lookCtrRm').css('color', "#000000");
		});
		$('.stdRotateCtr').mouseenter(function(){
		$('.rotateCtrRm').css('color',"#990000");
		}).mouseleave(function() {
			$('.rotateCtrRm').css('color', "#000000");
		});
		$('.panel').draggable({
			cursor : 'crosshair',
			handle : ".draghandle",
			containment : '.page',
			scroll : false
		});

	});

</script>
<div class='panel'>
	<div class="panelbar">
		场景面板
	</div>
	<div class="BMap_stdMpCtrl stdMoveCtr">
		<div class='moveCtrRm'>
			漫步
		</div>
		<div class="BMap_stdMpPan moveCtr" >
			<div class="BMap_button Move_f" title="前进"></div>
			<div class="BMap_button Move_l" title="左移"></div>
			<div class="BMap_button Move_r" title="右移"></div>
			<div class="BMap_button Move_b" title="后退"></div>
			<div class="BMap_button Move_o" title="原点"></div>
		</div>
	</div>
	<div class="BMap_stdMpCtrl stdLookCtr">
		<div class='lookCtrRm'>
			观察
		</div>
		<div class="BMap_stdMpPan lookCtr" >
			<div class="BMap_button Look_u" title="仰视"></div>
			<div class="BMap_button Look_l" title="左顾"></div>
			<div class="BMap_button Look_r" title="右盼"></div>
			<div class="BMap_button Look_d" title="俯视"></div>
			<div class="BMap_button Look_o" title="直视"></div>
		</div>
	</div>
	<div class="BMap_stdMpCtrl stdRotateCtr">
		<div class='rotateCtrRm'>
			旋转
		</div>
		<div class="BMap_stdMpPan rotateCtr">
			<div class="BMap_button Rotate_u" title="向上看"></div>
			<div class="BMap_button Rotate_l" title="左转"></div>
			<div class="BMap_button Rotate_r" title="右转"></div>
			<div class="BMap_button Rotate_d" title="向下看"></div>
		</div>
	</div>
	<div class="rTypePosition"></div>
</div>
<div class="facilityPanel "/></div>
